<template>
  <article>
    <h1 class="title">{{ post.title }}</h1>
    <article-meta-info
      :date="post.gmtCreate"
      :tags="post.tags"
      :pv="post.pv"
      :comments="post.comments"
      :likes="post.likes"
    />
    <article-user-info :uid="post.uid"/>
    <mavon-editor
      class="content"
      v-model="post.content"
      :toolbarsFlag="false"
      defaultOpen="preview"
      :subfield="false"
      ref="mavon"
    />
  </article>
</template>

<script>
import ArticleMetaInfo from '@/components/ArticleShow/Metainfo.vue'
import ArticleUserInfo from '@/components/ArticleShow/Userinfo.vue'

export default {
  name: 'ArticleMain',
  components: {ArticleMetaInfo, ArticleUserInfo},
  props: {
    post: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {}
  },

}
</script>

<style lang="scss" scoped>
article {
  position: relative;
  //border: 1px solid red;

  > .title {
    font-weight: bold;
    padding-left: 5px;
    margin-bottom: 5px;
    border-left: 3px solid blueviolet;
  }

  > .content {
    margin-top: -5px;
    box-shadow: none !important;
  }
}

.v-note-wrapper {
  z-index: 10;
}

::v-deep .v-show-content {
  padding: 5px 10px !important;
}
</style>